<template>
  <div>
    <a-card title="审批记录">
      <a slot="extra" href="#">
        <a-button type="primary" @click="$refs.taskFlowImage.show(bizId)">
          <icon-font type="icon-wf-chakan" />
          查看流程图
        </a-button>
      </a>
      <a-steps direction="vertical" :current="taskStep">
        <a-step v-for="(item,index) in records" :key="index" :title="item.nodeName">
          <template slot="description">
            <a-descriptions bordered size="small">
              <a-descriptions-item label="处理人">
                {{ item.assigneeDeptName + '/' + item.assigneeName }}
              </a-descriptions-item>
              <a-descriptions-item label="处理时间">
                {{ item.taskFinishTime }}
              </a-descriptions-item>
              <a-descriptions-item label="耗时">
                {{ item.duration }}
              </a-descriptions-item>
              <a-descriptions-item label="处理意见" :span="3">
                {{ item.comment }}
              </a-descriptions-item>
            </a-descriptions>
          </template>
        </a-step>
      </a-steps>
    </a-card>
    <!--流程图-->
    <task-flow-image :bizId="bizId" ref="taskFlowImage"/>
  </div>
</template>
<script>

import { findRecords } from '@/api/workflow/workflow'
import taskFlowImage from '@/components/flowable/task/taskFlowImage.vue'
import TaskButton from '@/components/flowable/task/taskButton.vue'

export default {
  name: 'HistoryTask',
  components: { TaskButton, taskFlowImage },
  props: {
    bizId: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      // 处理记录
      records: [],
      // 第几步
      taskStep: 0
    }
  },
  watch: {
    bizId: function (val) {
      if (val) {
        this.loadHisRecords(val)
      }
    }
  },
  methods: {
    /** 查询审批记录**/
    loadHisRecords (bizId) {
      findRecords(bizId).then(res => {
        if (res.code === 200) {
          this.records = res.data
          res.data.forEach(e => {
            if (e.taskFinishTime) {
              this.taskStep = this.taskStep + 1
            }
          })
        }
      })
    }
  }
}
</script>
